<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>商户查询</title>
    <meta content="webkit" name="renderer">
    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
    <link href="../../layuiadmin/layui/css/layui.css" media="all" rel="stylesheet">
    <link href="../../layuiadmin/style/admin.css" media="all" rel="stylesheet">
</head>
<body>
<div class="layui-card-body">
    <form>
        <label>商户编码：</label>
        <div class="layui-input-inline">
            <input class="layui-input" id="VendorCode" placeholder="请输入商户编码" type="text">
        </div>
        <label>商户名称：</label>
        <div class="layui-input-inline">
            <input class="layui-input" id="VendorName" placeholder="请输入商户名称" type="text">
        </div>
        <label style="padding-left:45px;"></label>
        <button class="layui-btn layui-btn-radius" data-type="reload" id="search" type="button">查&nbsp;&nbsp;询</button>
        <a class="layui-btn layui-btn-danger layui-btn-sm" href="javascript:getSUP();" id="T"
           style="margin-left: 20px;">增加商户</a>
        <br>
        <table class="layui-hide" id="vendortable" lay-filter="demo"></table>
    </form>
</div>
<script src="../../layuiadmin/layui/layui.js?t=1"></script>
<!-- 操作按钮 -->
<script id="barDemo" type="text/html">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <!--<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>-->
</script>
<script>
    layui.use('table', function () {
        var table = layui.table;
        var $ = layui.$;

        table.render({
            elem: '#vendortable'
            , url: 'http://localhost:8086/selectAllVendorForPage'
            , cellMinWidth: 80  //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            , data: []
            , cols:
                [
                    [
                        {field: 'vendorId', width: 80, title: 'ID', align: 'center', sort: true}
                        , {field: 'vendorCode', width: 90, title: '商户编码', align: 'center'}
                        , {field: 'vendorName', width: 100, title: '商户名称', align: 'center'}
                        , {field: 'personId', width: 100, title: '主联系人', align: 'center'}
                        , {field: 'phone', width: 110, title: '联系方式', align: 'center'}
                        , {field: 'enabledFlag', width: 110, title: '是否启用', align: 'center', sort: true}
                        , {field: 'address', width: 110, title: '地址'}
                        , {field: 'registeredArea', width: 110, title: '注册区域', align: 'center'}
                        /*,{field:'dd_ld', title: '钉钉组织id', sort: true}
                        ,{field:'orgId', title: '公司', width:137}*/
                        , {field: 'description', width: 110, title: '备注'}
                        , {fixed: 'right', width: 80, align: 'center', toolbar: '#barDemo'} 	//添加工具条
                    ]
                ]
            , page: true
            , done: function (data) {
            }
        });
        //为工具条添加监听
        //这里括号里对应table设置的lay-filter属性！！
        table.on('tool(demo)', function (obj) {
            //获取当前行数据
            var data = obj.data;
            //获取event对应的值
            var event = obj.event;
            //获取当前行的dom对象
            var tr = obj.tr;

            if (event === 'detail') {		//如果点击了查看按钮
                //执行查看详情的方法

            } else if (event === 'del') {	//如果点击了删除按钮
                //执行异步删除方法
                //删除方法
                var layer = layui.layer;
                layer.confirm('真的删除行么', function (index) {
                    //index表示第几次弹出层不是索引值，也不是主键等信息
                    //刷新页面重置
                    $.ajax({
                        url: 'http://localhost:8086/delVendor',
                        data: {'vendorID': data.vendorID},
                        type: "Post",
                        dataType: "json",
                        success: function (data) {
                            console.log(data);
                            layer.msg(data.msg);
                            /*location.reload(); //删除成功后再刷新*/
                            obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                            layer.close(index);
                        },
                        error: function (data) {
                            $.messager.alert('错误', data.msg);
                        }
                    });
                })
            } else if (event === 'edit') {	//如果点击了修改按钮
                //执行修改方法
                var layer = layui.layer;
                layer.open({
                    type: 2,
                    title: "编辑商户",
                    area: ['800px', '480px'],
                    skin: 'layui-layer-rim',
                    content: ['http://localhost:8086/page?url=new/updateVendor.html'],
                    success: function (layero, index) {
                        var body = layui.layer.getChildFrame('body', index);
                        if (data) {
                            // 取到弹出层里的元素，并把编辑的内容放进去
                            body.find("#vendorCode").val(data.vendorCode);
                            body.find("#vendorName").val(data.vendorName);
                            body.find("#personId").val(data.personId);  //联系人
                            body.find("#phone").val(data.phone);  //联系电话
                            body.find("#address").val(data.address);  //地址
                            body.find("#enabledFlag input[value=" + data.enabledFlag + "]").prop("checked", "checked");  //是否启用
                            body.find("#description").val(data.description);  //备注
                            // 记得重新渲染表单
                            form.render();
                        }
                        setTimeout(function () {
                            layui.layer.tips('点击此处返回用户列表', '.layui-layer-setwin .layui-layer-close', {
                                tips: 3
                            });
                        }, 500)
                    }
                });
            }
        });
        var active = {
            reload: function () {
                //搜索，执行重载
                table.reload('vendortable', {
                    url: 'http://localhost:8086/selectVendorForPage'
                    , where: {
                        /*id: document.getElementById("uid").value*/
                        vendorCode: document.getElementById("vendorCode").value
                    }
                });
            }
        };

        $('#search').on('click', function () {
            var type = $(this).data('type');
            console.info(type);
            active[type] ? active[type].call(this) : '';
        });
    });

    function getSUP() {
        var layer = layui.layer;
        layer.open({
            type: 2,
            title: "录入商户",
            area: ['800px', '480px'],
            skin: 'layui-layer-rim',
            content: ['http://localhost:8086/page?url=new/insertVendor.html']
        });
    }

</script>
</body>
</html>